<template>
  <div class="app-container">
    <el-form ref="queryForm" size="small" :inline="true" :model="queryParams">
      <el-form-item>
        <el-form-item>
          <el-input
            v-model="queryParams.hostName"
            placeholder="名称"
            clearable
            @keyup.enter.native="handleQuery(1)"
          />
        </el-form-item>
        <el-button
          class="filter-item"
          type="primary"
          icon="el-icon-search"
          @click="handleQuery(1)"
        >搜索
        </el-button>
      </el-form-item>
    </el-form>
    <el-table
      v-loading="loading"
      :data="pageList"
      row-key="id"
      default-expand-all
      border
    >
      <el-table-column prop="code" :label="$t('userEmail.table.userId')"/>
      <el-table-column prop="name" :label="$t('userEmail.table.emailName')"/>
      <el-table-column prop="address" :label="$t('userEmail.table.emailCode')"/>
      <el-table-column prop="port" :label="$t('userEmail.table.sendEmailInfo')"/>
      <el-table-column prop="serverId" :label="$t('userEmail.table.sendResult')"/>
      <el-table-column :label="$t('userEmail.table.isExpired')">
        <template slot-scope="scope">
          {{ scope.row.isExpired ?  $t('userSms.enums.expired') : $t('userSms.enums.notExpired') }}
        </template>
      </el-table-column>
      <el-table-column prop="created" :label="$t('userEmail.table.createTime')"/>
      <el-table-column prop="useStatus" :label="$t('userEmail.table.useStatus')">
        <template slot-scope="scope">
          <el-tag v-if="scope.row.useStatus===100" type="success">{{ $t('userSms.enums.used') }}</el-tag>
          <el-tag v-else type="info">{{ $t('userSms.enums.notUsed') }}</el-tag>
        </template>
      </el-table-column>
    </el-table>
    <pagination
      v-show="pagination.total>0"
      :total="pagination.total"
      :page.sync="pagination.page"
      :limit.sync="pagination.limit"
      @pagination="handleQuery"
    />
  </div>
</template>

<script>
import { lists } from '@/api/casino/email'

export default {
  name: 'casino_email',
  data() {
    return {
      // 遮罩层
      loading: true,
      // 列表数据
      pageList: [],
      deptOptions: [],
      queryParams: {
        hostName: undefined
      },
      // 分页数据
      pagination: {
        page: 1,
        limit: 10,
        total: 0
      }
    }
  },
  created() {

  },
  methods: {
    handleQuery(page) {
      if(page.page){
        this.pagination.page=page.page
      }else{
        this.pagination.page=page
      }
      this.loading = true
      this.queryParams.page = this.pagination.page
      this.queryParams.limit = this.pagination.limit
      lists(this.queryParams).then(response => {
        this.pageList = response.data
        this.pagination.total = response.total
        this.loading = false
      })
    }
  }
}
</script>

<style scoped>
</style>
